﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>进度条</title>
</head>
    <body>

        <div id="ppbar1" class="easyui-progressbar" data-options="value:60">
        </div>
        <div id="ppbar2" class="easyui-progressbar" data-options="value:60,text:'已上传{value}M'"></div>
        <div style="margin:10px 0;">  
            <a href="#" class="easyui-linkbutton" onclick="start()">开始</a>  
        </div> 
        <div id="ppbar3" class="easyui-progressbar">
            <script type="text/javascript">
                function start() {
                    var value = $('#ppbar3').progressbar('getValue');
                    //alert(value);
                    if (value < 100) {
                        value += Math.floor(Math.random() * 10);
                        $('#ppbar3').progressbar('setValue', value);
                        setTimeout(arguments.callee, 200);
                    }
                };  
            </script>
        </div>
    </body>
</html>
